<template>
  <el-upload
      ref="PDFToWord"
      class="upload-demo"
      :action="PDFToWordAction"
      :limit="1"
      :on-exceed="handleExceed"
      :auto-upload="false"
      accept=".pdf"
      :headers="headers"
      :http-request="uploadWord"
  >
    <template #trigger>
      <el-button type="primary" :loading="loading">选择PDF文件</el-button>
    </template>
    <el-button style="margin-left: 1rem" :loading="loading" type="success" @click="submitUpload">
      生成Word
    </el-button>
    <template #tip>
      <div class="el-upload__tip text-red">
        每次选择一个文件
      </div>
    </template>
  </el-upload>
</template>

<script>
import {ref,unref, getCurrentInstance, watch, reactive, onMounted} from "vue";
import {ElMessage, ElMessageBox, genFileId} from 'element-plus';
import {useRouter} from "vue-router";
import axios from "axios";

export default {
  name: "index",
  components:{

  },
  setup(props ,content){
    const router = useRouter()
    const {proxy} = getCurrentInstance();

    const PDFToWord = ref()
    let data = {
      form: ref({}),
      loading: ref(false),
      PDFToWordAction: ref(proxy.$appConfig.VUE_APP_API_HOST_DEFAULT +
          "/pdfToDoc"),//PDF转Word地址
      headers: ref({
        Authorization: window.localStorage.getItem("javawebtoken"),
        responseType: 'blob',
        "Content-Type": "application/json",
      }),
      PDFToWordFile: ref({
        fileData: "",
        fileName: "",
        fileType: "",
      }),
    }
    //监听
    watch(() => [props.info], ([newInfo],[oldInfo]) => {

    })
    onMounted(async () => {

    })
    let methods = {
      /**
       * 选择文件时触发
       * */
      handleExceed(files, fileList) {
        PDFToWord.value.clearFiles()
        let file = files[0]
        file.uid = genFileId()
        PDFToWord.value.handleStart(file)
      },
      submitUpload() {
        PDFToWord.value.submit()
      },

      /**
       * 上传文件操作
       * */
      uploadWord(file) {
        data.loading.value = true;
        let params = new FormData();
        params.append("file", file.file);
        axios.post(data.PDFToWordAction.value, params, {
          responseType: "blob",
          headers: data.headers.value,
        }).then((response) => {
          //判断是否导入成果
          if (response.data.type == "application/json") {
            //导入成功
          } else {
            //导入失败返回流文件
            const blob = new Blob([response.data], {type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"});
            const fileName = file.file.name.substring(0, file.file.name.indexOf("."));
            const link = document.createElement('a');
            link.href = URL.createObjectURL(blob);
            link.download = fileName;
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
            URL.revokeObjectURL(link.href);

            data.loading.value = false;
          }
        }).catch((error) => {
          console.log(error);
          data.loading.value = false;
        });
      },
    }

    return {
      proxy,
      router,
      PDFToWord,
      ...data,
      ...methods
    }
  }
}
</script>

<style lang="scss" scoped>

</style>